import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';

void main() {
  runApp(MaterialApp(home: TextHomePage()));
}

class TextHomePage extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return TextHomePageState();
  }
}

class TextHomePageState extends State {
  int? selectedValue;

  @override
  Widget build(BuildContext context) {
    var flag = false;
    return Scaffold(
        appBar: AppBar(
          title: Text("Text 讲解"),
        ),
        //Row/Column:继承自flex
        //  Flex：css Flex布局
        //  direction: Axis.horizontal 相对与row横向排列
        //  direction: Axis.vertical, 相当于column纵向排列
        /**
         * MainAxisAlignment 主轴
         * start    主轴开始的位置挨个摆放元素
         * end      主轴结束的位置挨个摆放元素
         * center   主轴的中心点对齐
         * spaceBetween   左右两边的间距为0其他元素之间平分
         * spaceAround    左右两边的间距是其他元素之间的一半
         * spaceEvenly 所有的间距平分
         */
        /**
         * crossAxisAlignment交叉轴
         *  start, 交叉轴开始位置对齐
         *  end, 交叉轴结束的位置对齐
         *  center, 中心点对齐
         *  stretch, 先让Row占据交叉轴尽可能大的空间，将所有的自widget交叉轴的高度拉伸到最大
         *  baseline, 基线对齐（必须有文本才能有效果）
         */
        //  row特点水平方向尽可能占据比较大的空间   --》水平方向也是希望包裹内容，那么设置mainAxisSize = min
        body: Stack(
          /**
           * stack默认的大小是包公内容的
           *alignment  从什么位置开始排布所以的子Widget
           * fit  将子元素拉伸到尽可能大
           * overflow 超出部分如何处理
           * Positioned 这个widget用来调整子空间的位置
           */
          alignment: Alignment.bottomLeft,
          children: [
            Image.asset("assets/image/img.png"),
            // Container(width: 150,height: 150,color: Colors.green,),
            Positioned(
              right: 0,
              left: 0,
              bottom: 0,
              child: Container(
                  color: Colors.black,
                  width: double.infinity,
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: [
                      Text(
                        "testssss",
                        style: TextStyle(color: Colors.white),
                      ),
                      Icon(Icons.favorite,color: Colors.white,)
                    ],
                  )),
            )
          ],
        ));
  }
}
